<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE html>
<html>
  <head>
    <title>换电收入清分</title>
    <base href="<%=basePath%>">
  </head>
  
  <body>
  
  	<jsp:include page="common.jsp"></jsp:include>
  	<jsp:include page="alert.jsp"></jsp:include>
  	
  	<div class="secMenu-content">
  		<div class="list-hearBar">
	  		<button type="button" class="btn btn-primary list-headBtn clearingAll" id="">批量结算</button>
	  		<a class="btn btn-primary list-headBtn" href="javascript:;">导出</a>
  			
  			<form class="form-inline list-headRight right" role="form">
				<select class="form-control">
				  <option>--选择网点--</option>
				  <option>全部</option>
				  <option>西斗门</option>
				</select>
				<select class="form-control">
				  <option>--选择状态--</option>
				  <option>未结算</option>
				  <option>已结算</option>
				</select>
				<select class="form-control">
				  <option>按周清分记录</option>
				  <option>按月清分记录</option>
				  <option>按季清分记录</option>
				  <option>按年清分记录</option>
				</select>
				
				<button type="submit" class="btn btn-info">搜索</button>
			</form>
  		</div>
  	
  	 	<table class="table table-hover table-striped table-condensed list-table">
	      <thead>
	        <tr>
	          <th><input type="checkbox" class="checkbox-length list-checkboxAll"></th>
	          <th>换电网点</th>
	          <th>周期总收入</th>
	          <th>清分比例</th>
	          <th>清分金额</th>
	          <th>清分日期</th>
	          <th>状态</th>
	          <th>操作员</th>
	          <th>操作日期</th>
	          <th>操作</th>
	        </tr>
	      </thead>
	      
	      <tbody>
	        <tr>
	          <th><input type="checkbox" class="list-checkbox"></th>
	          <td>西斗门</td>
	          <td>50000.0</td>
	          <td>60%</td>
	          <td>2500.0</td>
	          <td>2017-03-06</td>
	          <td class="list-state">未清分 </td>
	          <td class="list-operator"></td>
	          <td class="list-time"></td>
	          <td class="list-action">
	          	<a href="javascript:;" class="clearing-on">结算</a>
	          </td>
	        </tr>
	        <tr>
	          <th><input type="checkbox" class="list-checkbox"></th>
	          <td>西斗门</td>
	          <td>50000.0</td>
	          <td>60%</td>
	          <td>2500.0</td>
	          <td>2017-03-06</td>
	          <td class="list-state">未清分 </td>
	          <td class="list-operator"></td>
	          <td class="list-time"></td>
	          <td class="list-action">
	          	<a href="javascript:;" class="clearing-on">结算</a>
	          </td>
	        </tr>
	        
	        <tr>
	          <th><input type="checkbox" class="list-checkbox"></th>
	          <td>留下</td>
	          <td>50000.0</td>
	          <td>60%</td>
	          <td>2500.0</td>
	          <td>2017-03-06</td>
	          <td class="list-state">已清分 </td>
	          <td class="list-operator">张红</td>
	          <td class="list-time">2017-03-07</td>
	          <td class="list-action">
	          	<a href="javascript:;" class="clearing-on" style="display: none;">结算</a>
	          </td>
	        </tr>
	      </tbody>
	    </table>
	    
	    <nav>
		  <ul class="pagination right">
		    <li><a href="javascript:;">首页</a></li>
		    <li class="active"><a href="javascript:;">1</a></li>
		  	<li><a href="javascript:;">2</a></li>
		    <li><a href="javascript:;">3</a></li>
		    <li><a href="javascript:;">4</a></li>
		    <li><a href="javascript:;">5</a></li>
		    <li><a href="javascript:;">尾页</a></li>
		  </ul>
		</nav>
	</div>
	
	<script type="text/javascript">
		$(document).ready(function(){
			leftMenu.initBlock7_1();//左菜单栏初始化
			batchClearing();//批量结算
			oneClearing();//单条结算
		});
		
		function batchClearing(){
			$(".clearingAll").on("click",function(){
				if(notChooseTr()==false){
					var listChecked=$(".list-checkbox:checked").parents("tr");
					listChecked.find(".clearing-on").css("display","none");
					listChecked.find(".list-state").text("已清分");
					listChecked.find(".list-operator").text("张三");
					listChecked.find(".list-time").text("2017-03-06");
				};
			});
		}
		
		function oneClearing(){
			$(".clearing-on").on("click",function(){
				var thisItem=$(this);
				thisItem.css("display","none");
				thisItem.parents("tr").find(".list-state").text("已清分");
				thisItem.parents("tr").find(".list-operator").text("张三");
				thisItem.parents("tr").find(".list-time").text("2017-03-06");
			});
		}
		
	</script>
  </body>
</html>

